<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css">

<!-- Optional theme -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap-theme.min.css">

<!-- Latest compiled and minified JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script>
	var level1=0;
	var level2=0;
	var level3=0;
	function tambah_level1() {
	    level1++;
	    var addin='<div class="form-group" id="level1-'+level1+'"><br><input type="text" class="form-control pull-left" name="level1['+level1+']" size="60" maxlength="60"><button onclick="tambah_level2('+level1+')" type="button" class="btn btn-success pull-left"><span class="glyphicon glyphicon-plus"></span>Tambah Sub</button><button type="button" onclick="hapus_level1('+"'#"+'level1-'+level1+"'"+')" class="btn btn-danger pull-left"><span class="glyphicon glyphicon-trash"></span></button><div id="level2-'+level1+'"></div></div>';
	    
	    $('#level1').append(addin);
	}
	
	function hapus_level1(id) {
	    $(id).remove();
	}
	
	function tambah_level2(id) {
	    var addin='<div style="margin-left:30px;" class="form-group" id="level2-'+id+'-'+level2+'"><br><input type="text" class="form-control pull-left" name="level2['+id+']['+level2+']" size="60" maxlength="60"><button onclick="tambah_level3('+level2+')" type="button" class="btn btn-success pull-left"><span class="glyphicon glyphicon-plus"></span>Tambah Sub</button><button type="button" onclick="hapus_level2('+"'#"+'level2-'+id+'-'+level2+"'"+')" class="btn btn-danger pull-left"><span class="glyphicon glyphicon-trash"></span></button><div id="level3-'+level2+'"></div></div>';
	    
	    $('#level2-'+id).append(addin);
	    level2++;
	}
	
	function hapus_level2(id) {
	    $(id).remove();
	}
	
	function tambah_level3(id) {
	    level3++;
	    var addin='<div style="margin-left:60px;" class="form-group" id="level3-'+id+'-'+level3+'"><br><input type="text" class="form-control pull-left" name="level3['+id+'][]" size="60" maxlength="60"><button type="button" onclick="hapus_level3('+"'#"+'level3-'+id+'-'+level3+"'"+')" class="btn btn-danger pull-left"><span class="glyphicon glyphicon-trash"></span></button></div>';
	    
	    $('#level3-'+id).append(addin);
	}
	
	function hapus_level3(id) {
	    $(id).remove();
	}
</script>
<?php
if($username == "")
{
	redirect('login', 'refresh');
}
?>
<form method="post" action="<?php echo base_url();?>index.php/project/saveIG" enctype="multipart/form-data">
  <div class="form-group">
    <label for="inputEmail3" class="col-sm-4 control-label">SUBJECT/TYPE OF WORK : </label>
    <div class="col-sm-7">
      <input type="text" name ="subject" class="form-control">
      <input type="hidden" name ="idThread" class="form-control" value="<?php echo $projectId;?>">
    </div>
  </div>
  <div class="form-group">
    <label for="inputEmail3" class="col-sm-4 control-label">REF NO. :</label>
    <div class="col-sm-7">
      <input type="text" name="ref_no"  class="form-control">
    </div>
  </div>
  <div class="form-group">
    <label for="inputEmail3" class="col-sm-4 control-label">DRAWING TITLE :</label>
    <div class="col-sm-7">
      <input type="text" name="drawing_title" class="form-control">
    </div>
  </div>
  <div class="form-group">
    <label for="inputEmail3" class="col-sm-4 control-label">DRAWING NO. :</label>
    <div class="col-sm-7">
      <input type="text" name="drawing_no" class="form-control">
    </div>
  </div>
  <div class="form-group">
    <label for="inputEmail3" class="col-sm-4 control-label">LOCATION (AREA, NO.PIER, STA) :</label>
    <div class="col-sm-7">
      <input type="text" name="location" class="form-control">
    </div>
  </div>  
  <div class="form-group">
    <label for="inputEmail3" class="col-sm-4 control-label">DESCRIPTION/REMARK/SKETCH :</label>
    <div class="col-sm-7" id="level1">
      <input type="text" class="form-control pull-left" name="level1[]" size="60" maxlength="60">
	    <button type="button" onclick="tambah_level2(0)"  class="btn btn-success pull-left"><span class="glyphicon glyphicon-plus"></span>Tambah Sub</button>
	
	    <div id="level2-0"></div>
    </div>
  </div>
  
  <div class="form-group">
    <div class="col-sm-offset-2 col-sm-10">
	<button type="button" onclick="tambah_level1()" class="btn btn-primary"><span class="glyphicon glyphicon-plus"></span> Tambah</button>
      <button type="submit" class="btn btn-default">Simpan</button>
    </div>
  </div>
</form>